<template>
	<div>
		<uni-list>
			<uni-list-item title="车牌号码" :rightText="formData.licensePlate" />
			<uni-list-item title="车型" :rightText="carType_[formData.carType]" />
			<uni-list-item title="车宽(米)" :rightText="formData.carWidth" />
			<uni-list-item title="载重(吨)" :rightText="formData.loadCapacity" />
			<uni-list-item title="车长(米)" :rightText="formData.carLength" />
			<uni-list-item title="车高(米)" :rightText="formData.carHeight" />
			<uni-list-item title="体积(方)" :rightText="formData.volume" />
			<uni-list-item title="车身颜色" :rightText="color_[formData.color]" />
			<uni-list-item title="运输用途" :rightText="transportUsage_[formData.transportUsage]" />
			<uni-list-item title="运输油品" :rightText="energyType_[formData.energyType]" />
			<uni-list-item title="价格(万)" :rightText="formData.purchasePrice" />
			<uni-list-item title="车主姓名" :rightText="formData.ownerName" />
			<uni-list-item title="联系电话" :rightText="formData.contactNumber" />
			<uni-list-item title="车主身份证" :rightText="formData.ownerIdCard" />
			<uni-list-item title="品牌型号" :rightText="formData.brandType" />
			<uni-list-item title="车辆识别代码" :rightText="formData.vin" />
			<uni-list-item title="车主所在地址" :rightText="formData.ownerLocationDistrictName+''+formData.ownerLocationAddress" />
			<uni-list-item>
				<template v-slot:body>
					<text style="font-size: 14px;color: #3b4144;overflow: hidden;width: 90px;">相关资料</text>
				</template>
				<template v-slot:footer>
					<div style="flex: 1;">
						<myfilepicker readonly :fileIdString="formData.vehicleAttachment" :fileMediatype="'image'"></myfilepicker>
						<myfilepicker readonly :fileIdString="formData.carPicAttachment" :fileMediatype="'image'"></myfilepicker>
						<myfilepicker readonly :fileIdString="formData.otherAttachment" :fileMediatype="'all'"></myfilepicker>
					</div>
				</template>
			</uni-list-item>
			<uni-list-item title="备注" :rightText="formData.remark" />
		</uni-list>
		<view style="height: 20px;"></view>
		<view v-if="driverList.length>0" style="position: relative;display: flex;flex-direction: row;align-items: center;padding: 12px 10px;font-weight: 400;">
			<view style="width: 4px;height: 12px;border-radius: 10px;background-color: #2979ff;margin-right: 6px"></view>
			<view style="display: flex;flex-direction: column;flex: 1;color: #333;">关联司机</view>
		</view>
		<!-- <template v-if="driverList.length>0"><uni-tag style="margin-left: 15px;" :inverted="true" text="关联司机" type="primary" /></template> -->
		<view v-for="(item,index) in driverList" :key="index">
			<uni-card :title="'司机:'+item.carrierDriver.driverName" :sub-title="'电话:'+item.carrierDriver.phoneNumber" :extra="item.mainDriver==='1'?'主驾':''">
				<view style="display: flex;justify-content: space-between;">
					<text v-if="item.carrierDriver.sex=='0'">性别：男</text>
					<text v-else-if="item.carrierDriver.sex=='1'">性别：女</text>
					<text v-else>性别：未知</text>
					<text>驾驶证类型：{{item.carrierDriver.licenseType}}</text>
					<text>驾龄：{{item.carrierDriver.drivingYears}}年</text>
					<text v-if="item.carrierDriver.ownVehicle==0">加盟</text>
					<text v-else>自有</text>
				</view>
			</uni-card>
		</view>
		<view style="height: 50px;"></view>
	</div>
</template>

<script>
	import {
		getCarDetails
	} from '@/api/system/car.js'
	import {getDicts} from '@/api/system/dict.js'
	import myfilepicker from '@/components/uploadFile/uploadFile.vue'
	
	export default {
		components: {
			myfilepicker
		},
		data() {
			return {
				formData:{}, //详情
				// 关联司机
				driverList: [],
				//下拉框 ->车型
				carType_: [],
				//下拉框 ->车辆颜色
				color_: [],
				//下拉框 ->运输用途
				transportUsage_: [],
				//下拉框 ->是否车头
				headType_: [],
				//下拉框 ->能源类型
				energyType_: [],
				carId:'',
			}
		},
		onLoad(e) {
			if (e.carId) {
				uni.showLoading({
					title: '正在加载',
				})
				this.carId = e.carId
				//获取车辆详情
				getCarDetails(e.carId).then(res => {
					uni.hideLoading()
					if (res.code == '200') {
						this.formData = res.data||[]
						this.driverList=this.formData.driverList||[]
					} else {
						uni.showToast({
							icon: 'none',
							title: res.msg
						})
					}
				})
			}
		},
		created() {
			//获取车型下拉框
			getDicts('car_type').then(res=>{
				res.data.forEach(item=>{
					this.carType_[item.dictValue]=item.dictLabel
				})
			})
			//获取车辆颜色下拉框
			getDicts('car_color').then(res=>{
				res.data.forEach(item=>{
					this.color_[item.dictValue]=item.dictLabel
				})
			})
			//获取运输用途下拉框
			getDicts('transport_usage').then(res=>{
				res.data.forEach(item=>{
					this.transportUsage_[item.dictValue]=item.dictLabel
				})
			})
			//获取车头类型下拉框
			getDicts('head_type').then(res=>{
				res.data.forEach(item=>{
					this.headType_[item.dictValue]=item.dictLabel
				})
			})
			//获取能源类型下拉框
			getDicts('energy_type').then(res=>{
				res.data.forEach(item=>{
					this.energyType_[item.dictValue]=item.dictLabel
				})
			})
		},
		methods: {
			
		},
	}
</script>

<style scoped>
::v-deep .uni-list-item__extra{
	flex: 1;
}
</style>